<template>
  <el-timeline>
    <el-timeline-item
      v-for="(item, index) in timelineItems"
      :key="index"
      :timestamp="item.timestamp"
      placement="top"
    >
      <el-card>
        <h4>{{ item.title }}</h4>
        <p>{{ item.author }} 提交于 {{ item.date }}</p>
        <el-button type="primary" :icon="Edit" circle />
      </el-card>
    </el-timeline-item>
  </el-timeline>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import axios from 'axios'
import { Edit } from '@element-plus/icons-vue'

// 定义响应式数据
const timelineItems = ref([]);



// 导入图标
const EditIcon = Edit;

// 使用 onMounted 获取后端日志信息
onMounted(async () => {
  try {
    const response = await axios.get('api/script/news/getNews');  // 替换为你的后端 API URL
    // console.log('news:',response);
    timelineItems.value = response.data;  // 将获取到的数据赋值给 timelineItems
  } catch (error) {
    console.error('获取日志信息失败:', error);  // 错误处理
  }
});

</script>


<style scoped>
/* 添加你的样式 */
</style>